const path = require("path");
const MiniCssExtractPlugin = require("mini-css-extract-plugin");
const variable = require("./webpackUtils/variable");
const resolveConfig = require("./webpackUtils/resolve");
const plugins = require("./webpackUtils/plugins");
const { SRC_PATH, DIST_PATH, IS_DEV, IS_PRO, getCDNPath } = variable;

const config = {
  entry: {
    index: path.join(SRC_PATH, "index.tsx"),
  },
  output: {
    path: DIST_PATH,
    filename: IS_DEV
      ? "js/[name].bundle.js"
      : "js/[name].[contenthash:8].bundle.js",
    publicPath: getCDNPath(),
    globalObject: "this",
    chunkFilename: IS_DEV
      ? "js/[name].chunk.js"
      : "js/[name].[contenthash:8].chunk.js",
    assetModuleFilename: "assets/[hash][ext][query]",
    clean: true,
  },
  //loader的执行顺序默认从右到左，多个loader用[],字符串只用一个loader，也可以是对象的格式
  module: {
    rules: [
      {
        test: /\.(tsx?|js)$/,
        include: [SRC_PATH],
        use: [
          {
            loader: "thread-loader",
            options: {
              workers: require("os").cpus().length * 2,
              parallel: true,
            },
          },
          {
            loader: "babel-loader", // 这是一个webpack优化点，使用缓存
            options: {
              cacheDirectory: true,
            },
          },
        ],
        exclude: [/node_modules/, /public/, /(.|_)min\.js$/],
      },
      {
        test: /\.css$|\.scss$/i,
        include: [SRC_PATH],
        exclude: /node_modules/, // 取消匹配node_modules里面的文件
        use: [
          IS_DEV ? "style-loader" : MiniCssExtractPlugin.loader,
          {
            loader: "css-loader",
            options: {
              modules: false,
              sourceMap: !IS_PRO,
            },
          },
          "postcss-loader",
          "sass-loader",
          {
            loader: "style-resources-loader",
            options: {
              patterns: path.resolve(SRC_PATH, "assets", "css", "core.scss"),
            },
          },
        ],
      },
      {
        test: /\.(png|jpg|gif|jpeg|webp|svg)$/,
        type: "asset/resource",
        generator: {
          publicPath: "../",
          filename: "./assets/images/[hash][ext][query]",
        },
      },
      {
        test: /\.(woff|woff2|eot|ttf|otf)$/i,
        type: "asset/resource",
        generator: {
          publicPath: "../",
          filename: "./assets/fonts/[hash][ext][query]",
        },
      },
    ],
  },
  resolve: resolveConfig,
  plugins: plugins.getPlugins(),
};

module.exports = config;
